<!--ajax实现点击加载-->
<!--需要jq.js和ajax_load.php支持-->
<html>
	<head>
		<meta charset="UTF-8">
		<title>ajax实现点击加载</title>
		<script src="jq/jquery.js" type="text/javascript"></script>
	</head>
	<body>
		<table border="1" style="margin:30px auto">
			<tr>
				<th>编号</th>
				<th>标题</th>
				<th>操作</th>
			</tr>
			<tr>
				<td>1</td>
				<td>----这里没做初始加载----</td>
				<td><a href="#">删除</a></td>
			</tr>
			<tr id="end">
				<td colspan="3"><button id="btn" type="button">点击加载</button></td>
			</tr>
		</table>
	</body>
	<script type="text/javascript">
		var i =1;
		$("#btn").click(function(){
		  	$.ajax({
		  	  	url:"ajax_load.php",
		  	  	type:"post",
		  	  	data:"init="+i,
		  	  	dataType:"json",//服务器必须响应json
		  	  	success:function(data){
		  	  		i++;
		  	  		if(data.length !=0){
			  	  		for(key in data){
			  	  			$("#end").before("<tr><td>"+data[key].articleId+"</td><td>"+data[key].title+"</td><td><a href='#'>删除</a></td></tr>");
			  	  		}
		  	  		}else{
		  	  			alert("没有更多的了...");
		  	  		}
		  	  	},
		  	});		  	 		  	 
		})		  
	</script>
</html>